/*
* @Author: 董洌淇
* @Date: 2020年10月20日14:20:57
* @Last Modified by: 董洌淇
* @Last Modified time: 2020年10月20日14:21:06
* @Description: 消息列表-标识，暂时无用
*/
<template>
	<view class="msg-lsit">
		<cu-custom bgColor="bg-blue" :isBack="true"><block slot="backText"></block><block slot="content">{{ titleName }}</block></cu-custom>
		<view class="msg-list-box">
			<view class="msg-content margin-t-20upx" v-for="(item, index) in msgListData" :key="index" @click="goMsgDetails(item)">
				<text>{{ item.msg }}</text>
			</view>
		</view>
		<view class="cu-load load-modal" v-if="loadModal">
			<image src="/static/appicon-72.png" mode="aspectFit"></image>
			<view class="gray-text">加载中...</view>
		</view>
	</view>
</template>

<script>
	import { getPersonnel, getWarningList } from '@/api/msgApi'
	export default {
		name: 'msgLsit',
		data() {
			return {
				loadModal: false, // loading 状态
				totalNum: 0, // 获取信息条数
				titleName: '标题', // 标题栏标题
				strMap: { // 根据返回的报警类型映射不同的级别
					'1': '预警', // 1 后端对应映射关系
					'2': '报警', // 2 后端对应映射关系
					'3': '高报警', // 3 后端对应映射关系
					'4': '超高报警' // 4 后端对应映射关系
				},
				warningType: {
					4:'一级超高报警',
					3:'二级高报警',
					2:'三级报警',
					1:'四级预警'
				},
				filter: { // 请求条件
					limit: 10,
					page: 1,
					eventType: 1
				},
				personnelData: [], // 推送组织列表
				msgListData: [] // 消息列表
			}
		},
		onShow () {
			this.getMsgListFun(1) // 获取消息列表
		},
		onLoad (data) {
			// this.getMsgListFun(data.type) // 获取消息列表
			this.titleName = this.strMap[data.type] // 标题字段映射
			this.filter.eventType = Number(data.type) // 根据不同类型报警，请求对象不同
			// this.getMsgPersonnelFun(data.type) // 获取人员转向信息
		},
		methods: {
			// 获取转向人员信息
			getMsgPersonnelFun (data) {
				getPersonnel(data).then(res => {
					console.log(res,'res')
					if(res.data.code === 0) {
						this.personnelData = res.data.data.enterprises
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none',
							duration: 2000
						})
					}
				}).catch(err => {
					uni.showToast({
						title: '服务器错误，请稍后尝试!',
						icon: 'none',
						duration: 2000
					})
				})
			},
			// 获取消息列表
			getMsgListFun (data) {
				console.log(data,'消息列表')
				console.log(this.filter,'this.filter')
				this.loadModal = true
				let _msgData = []
				getWarningList(data, this.filter).then(res => {
					if (res.data.code === 0) {
						console.log(res,'res')
						let _temp = res.data.data
						this.totalNum = _temp.total
						_temp.list.map((v) => {
							_msgData.push({
								id: v.id,
								msg: v.createDate +  ' ' + v.deviceName + ' 触发' + this.warningType[v.eventType] + '，' + v.currentValue + '（' + v.limitValue + ')' + '，请检查。'
								// msg: v.createDate + ' '+ v.deviceAddress + ' ' + v.deviceName + ' 触发' + this.warningType[v.eventType] + '，' + v.currentValue + '（' + v.limitValue + ')' + '，请检查。'
								// msg: v.createDate + ' ' + v.deviceName + ' ' +v.metricName + '触发' + this.warningType[v.eventType] + '，当前值' + v.currentValue + '（' + '预警范围：' + v.limitValue + ')' + '，请检查。' + '转向人员包括：' + this.personnelData.join()
							})
						})
						this.msgListData = _msgData
						this.loadModal = false
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none',
							duration: 2000
						})
					}
				}).catch(err => {
					uni.showToast({
						title: '服务器错误，请稍后尝试!',
						icon: 'none',
						duration: 2000
					})
				})
			},
			// 跳转消息详情
			goMsgDetails (data) {
				uni.navigateTo({
				    url:"./msgDetails?msg=" + JSON.stringify(data)
				})
			}
		},
		// 下滑到底部执行函数
		onReachBottom() {
			this.filter.limit = (this.filter.limit + 10) // 每次滑动到底部length + 10
			if (this.filter.limit > this.totalNum) {
				this.filter.limit = this.totalNum
				this.getMsgListFun(1) // 获取消息列表
				uni.showToast({
					title: '没有更多啦!',
					icon: 'none',
					duration: 2000
				})
				return
			}
			this.getMsgListFun(1) // 获取消息列表
		}
	}
</script>

<style lang="scss" scoped>
	.msg-lsit {
		.msg-list-box {
			height: 100%;
			background-color: $uni-bg-color-F7F7F7;
			.msg-content {
				background-color: $uni-bg-color;
				padding: 40upx 5% 40upx;
			}
		}
	}
</style>
